var OrderWarehouse = function () {
  var template = /* html */ `
    <div class="order-warehouse" v-loading.fullscreen.lock="loading">
      <div class="queryForm">
        <search-btn-view btn-text="订单库存查询" @before-open="resetSearch" @search="searchData">
          <template slot="append">
            <el-button size="medium" type="primary" @click="exportExcel">导出excel</el-button>
          </template>
          <div slot="search-content">
            <search-form :search="search" type="order"></search-form>
          </div>
        </search-btn-view>
      </div>
      <div style="color:#ff0000;margin-bottom:5px;">库存数列文字红色代表采购未入库但已领料</div>
      <div class="order-warehouse-table-div">
        <el-table fit stripe border :data="warehouseList" style="width:100%;" height="parent">
          <el-table-column sortable prop="companyOrderId" label="订单编号" min-width="140px" header-align="center">
          </el-table-column>
          <el-table-column sortable prop="factoryNo" label="工厂型号" min-width="120px" header-align="center">
          </el-table-column>
          <el-table-column sortable prop="customerNo" label="客户型号" min-width="120px" header-align="center">
          </el-table-column>
          <el-table-column sortable :resizable="false" prop="rowIndex" label="订单序号" width="120px" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.rowIndex===-1?globalConfig.orderDefaultRowIndex:scope.row.rowIndex}}</span>
            </template>
          </el-table-column>
          <el-table-column sortable prop="providerName" label="供应商" min-width="120px" header-align="center">
          </el-table-column>
          <el-table-column sortable prop="materialName" label="物料名称" min-width="120px" header-align="center"></el-table-column>
          <el-table-column sortable prop="color" label="编号" min-width="120px" header-align="center"></el-table-column>
          <el-table-column sortable prop="colorDescription" label="描述" min-width="120px" header-align="center"></el-table-column>
          <el-table-column sortable prop="model" label="规格型号" min-width="120px" header-align="center"></el-table-column>
          <el-table-column sortable prop="providerNo" label="供方编号" min-width="100px" header-align="center"></el-table-column>
          <el-table-column sortable prop="feedCount" label="投料数" min-width="100px" align="center"></el-table-column>
          <el-table-column sortable prop="purchaseCount" label="采购数" min-width="100px" align="center"></el-table-column>
          <el-table-column sortable prop="receiveCount" label="已领料数" min-width="100px" align="center"></el-table-column>
          <el-table-column sortable prop="inCount" label="入库数" min-width="100px" align="center"></el-table-column>
          <el-table-column sortable prop="outCount" label="出库数" min-width="100px" align="center"></el-table-column>
          <el-table-column sortable prop="stockCount" label="库存数" min-width="100px" align="center">
            <template slot-scope="scope">
              <span :style="{color:scope.row.stockCount<0?'#ff0000':null}">{{scope.row.showStockCount}}</span>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <table-pagination v-if="pagination.totalCount!==0" :pagination="pagination" @change="pageChange"></table-pagination>
    </div>
  `;

  return {
    mixins: [
      tablePaginationMixin()
    ],
    data: function () {
      var search = {
        materialName: '',
        model: '',
        color: '',
        providerName: '',
        isValid: '',
        orderId: '',
        companyOrderId: '',
        factoryNo: '',
        customerNo: '',
        providerNo: ''
      };
      return {
        loading:false,
        search: _.cloneDeep(search),
        oldSearch: _.cloneDeep(search),
        warehouseList: []
      };
    },

    created:function(){
      this.setWarehouseList(true);
    },

    methods:{
      setWarehouseList:function(isSearch){
        if (!isSearch) {
          this.search = _.cloneDeep(this.oldSearch);
        }

        var pagination = this.pagination;
        var currentPage = pagination.currentPage;
        var pageSize = pagination.pageSize;
        var start = (currentPage - 1) * pageSize;
        postData = {
          start: start,
          length: pageSize
        };

        this.setPostData(postData);
        
        this.loading = true;
        var self = this;
        ajaxRequest("companyMaterialCount/getOrderMaterialStockCount",postData).then(function(res){
          if (isSearch) {
            self.oldSearch = _.cloneDeep(self.search);
          }

          var warehouseList = res.returnData;
          for (var i = 0; i < warehouseList.length; i++) {
            var warehouse = warehouseList[i];
            var stockCount = warehouse.stockCount;
            var showStockCount;
            if (stockCount < 0) {
              showStockCount = 0;
            } else {
              showStockCount = stockCount;
            }
            warehouse.showStockCount = showStockCount;
          }

          self.warehouseList = warehouseList;
          self.pagination.totalCount = res.iTotalRecords;
          self.loading = false;
        }).catch(function(){
          self.loading = false;
        });
      },

      resetSearch:function(){
        this.search = _.cloneDeep(this.oldSearch);
      },

      searchData:function(){
        this.pagination.currentPage = 1;
        this.setWarehouseList(true);
      },

      pageChange:function(){
        this.setWarehouseList();
      },

      setPostData:function(postData){
        var search = this.search;
        var fields = ['materialName', 'model', 'color', 'providerName', 'providerNo', 'orderId', 'companyOrderId',
          'factoryNo', 'customerNo', 'isValid'
        ];
        SysUtil.setPostData(postData, search, fields);
      },

      exportExcel:function(){
        this.search = _.cloneDeep(this.oldSearch);
        var postData = {};
        this.setPostData(postData);
        var formParam = SysUtil.formatFormParam(postData);
        var basePath = SysUtil.getBasePath();
        var path = `${basePath}/companyMaterialCount/exportOrderMaterialExcelFile?${formParam}`;
        window.open(path);
      }
    },

    components:{
      SearchBtnView: SearchBtnView,
      SearchForm: SearchForm
    },

    template: template
  };
}();